<template>
    <view class="fb-category">
        <view class="topbanner nova-column nova-flex nova-row-center" style="width: 100%;">
            <text style="height: 130rpx; line-height: 130rpx; color: #999999; font-size: 24rpx; text-align: center;">{{ getDesc() }}</text>
        </view>
        <view class="menu">
            <view v-for="(item, index) in types" :key="index" class="option" @click="goSkill(index)">
                <image :src="'/static/jn/c' + (index + 1) + '.png'" mode="widthFix" />
                <view class="optname">{{ item.name }}</view>
                <view class="optnote">{{ item.note }}</view>
            </view>
        </view>
    </view>
</template>

<script>
export default {
    name: 'p-publish-category',
    props: {
        resume_id: {
            type: String,
            default: ''
        },
        publish_id: {
            type: String,
            default: ''
        },
        delegate: {
            type: Number,
            default: undefined
        }
    },
    data() {
        return {
            role: '',
            mydelegate: undefined,
            types: [
                {
                    name: '钟点工',
                    note: '优秀阿姨定期上门'
                },
                {
                    name: '单次保洁',
                    note: '一站式保洁服务'
                },
                {
                    name: '月嫂',
                    note: '金牌认证母婴呵护'
                },
                {
                    name: '育婴师',
                    note: '营养护理科学早教'
                },
                {
                    name: '住家保姆',
                    note: '烦心家务轻松解决'
                },
                {
                    name: '老人陪护',
                    note: '居家陪伴生活照料'
                },
                {
                    name: '催乳师',
                    note: '科学催乳上门服务'
                },
                {
                    name: '病人陪护',
                    note: '健康护理陪同医疗'
                }
            ]
        };
    },

    methods: {
        getDesc() {
            if (this.role == 1) {
                return '请选择您所具备的技能';
            } else if (this.role == 2) {
                if (this.mydelegate == 1) {
                    return '请选择您家阿姨所具备的技能';
                } else {
                    return '请选择您所需要的服务';
                }
            } else if (this.role == 3) {
                if (this.mydelegate == 1) {
                    return '请选择阿姨所具备的技能';
                } else if (this.mydelegate == 2) {
                    return '请选择业主所需要的服务';
                }
            }
        },
        goSkill(i) {
            if (this.role == 1) {
                uni.redirectTo({
                    url: `../c/p-publish?index=${i}&resume_id=${this.resume_id}`
                });
            } else if (this.role == 2) {
                if (!this.$checkIdentification()) {
                    return;
                }
                if (this.mydelegate == 1) {
                    console.log('业主分享阿姨');
                    uni.redirectTo({
                        url: `../c/p-publish?index=${i}&resume_id=${this.resume_id}`
                    });
                } else {
                    uni.navigateTo({
                        url: `../c/p-publish-job?index=${i}&publish_id=${this.publish_id}`
                    });
                }
            } else if (this.role == 3) {
                console.log('公司代发');
                if (!this.$checkIdentification(40)) {
                    return;
                }
                if (this.mydelegate == 1) {
                    console.log('代阿姨发求职单');
                    uni.redirectTo({
                        url: `../c/p-publish?index=${i}&resume_id=${this.resume_id}`
                    });
                } else if (this.mydelegate == 2) {
                    console.log('代业主发需求单');
                    uni.navigateTo({
                        url: `../c/p-publish-job?index=${i}&publish_id=${this.publish_id}`
                    });
                }
            }
        }
    },
    created() {
        this.role = this.$global.role;
        if (this.mydelegate === undefined) {
            this.mydelegate = this.delegate;
        }
        console.log(`create role is ${this.role} and mydelegate = ${this.mydelegate}`);
    },
    onLoad(options) {
        console.log("onLoad", options);
        this.resume_id = options.resume_id || '';
        this.publish_id = options.publish_id || '';
        this.role = this.$global.role;
        if (options.delegate) {
            this.mydelegate = options.delegate;
        }
        console.log(`onload role is ${this.role}, mydelegate = ${this.mydelegate} resume_id=${this.resume_id}, publish_id=${this.publish_id}`);
    }
};
</script>

<style lang="scss">
.fb-category {
    .topbanner {
        width: 750rpx;
        image {
            width: 100%;
            height: 276rpx;
        }
    }
    .menu {
        display: flex;
        flex-wrap: wrap;
        align-content: space-between;
        justify-content: space-between;
        align-items: center;
        padding: 0rpx 54rpx 0rpx 54rpx;
        .option {
            width: 300rpx;
            padding-top: 30rpx;
            margin-bottom: 20rpx;
            display: flex;
            flex-direction: column;
            align-items: center;
            height: 176rpx;
            border: 1px solid #f1f1f1;
            border-radius: 10rpx;
            .opt-left {
                width: 214rpx;
                padding-left: 26rpx;
            }
            .optname {
                font-size: 32rpx;
                line-height: 60rpx;
                color: #333333;
            }
            .optnote {
                font-size: 20rpx;
                //line-height: 30rpx;
                color: #999999;
            }
            image {
                width: 60rpx;
                height: 60rpx;
                margin-top: 0rpx;
            }
        }
        .option:nth-child(even) {
            //border-right: none;
        }
    }
}
</style>
